<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/MI-BOX.css">
    <link rel="stylesheet" href="css/MI-HY.css">
    <link rel="stylesheet" href="css/mi.css">
    <title>小米盒子</title>
</head>
<body>
    <!-- 头部开始 -->
    <div class="header">
        <div class="container">
            <div class="left-nav">
                <ul>
                    <li><a href="">小米网</a></li>
                    <li><a href="">MIUI</a></li>
                    <li><a href="">米聊</a></li>
                    <li><a href="">游戏</a></li>
                    <li><a href="">多看阅读</a></li>
                    <li><a href="">云服务</a></li>
                    <li><a href="">小米网移动版</a></li>
                    <li><a href="">Select region</a></li>
                </ul>
            </div>
            <div class="login">
                <ul>
                    <li><a href="">登入</a></li>
                    <li><a href="">注册</a></li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 头部结束 -->
    <!-- 内容开始 -->
    <div class="content-container">
        <!-- logo、搜索框开始 -->
        <div class="top">
            <div class="logo">
                <img src="images/logo.png" alt="">
            </div>
            <div class="search">
                <p><img src="images/clock.png">4月14日开放购买</p>
                <br>
                <form>
                    <div>
                        <input type="text" name="" id="" placeholder="搜索您需要的商品">
                        <input class="search-btn" type="submit" value=" ">
                    </div>
                    <a href="">小米手环</a>
                    <a href="">小米音箱</a>
                    <a href="">保护壳</a>
                    <input class="shopping-cart" type="submit" value="购物车">
                </form>
            </div>
        </div>
        <!-- logo、搜索框结束 -->
        <!-- 导航开始 -->
        <div class="nav">
            <div class="drop">
                <a href="MI-All.html">全部商品分类 &or;</a>
                <div class="nav-drop">
                    <ul>
                        <li><a href="">手机 电话卡</a></li>
                        <li><a href="">电视 盒子</a></li>
                        <li><a href="">笔记本 平板</a></li>
                        <li><a href="">家电 插线板</a></li>
                        <li><a href="">出行 穿戴</a></li>
                        <li><a href="">智能 路由器</a></li>
                        <li><a href="">电源 配件</a></li>
                        <li><a href="">个护 儿童</a></li>
                        <li><a href="">耳机 音箱</a></li>
                        <li><a href="">生活 箱包</a></li>
                    </ul>
                </div>
            </div>
            <div class="right-nav">
                <ul>
                    <li><a href="">首页</a></li>
                    <li><a href="">小米手机</a></li>
                    <li><a href="">红米</a></li>
                    <li><a href="">小米平板</a></li>
                    <li><a href="">小米电视</a></li>
                    <li><a href="">盒子</a></li>
                    <li><a href="">路由器</a></li>
                    <li><a href="MI-HY.html">合约机</a></li>
                    <li><a href="MI-Ser.html">服务</a></li>
                    <li><a href="">社区</a></li>
                </ul>
            </div>
        </div>
        <!-- 导航结束 -->
        <!-- 横向小导航开始 -->
        <div class="sm-nav">
            <div class="box-title">
                <h4>小米小盒子</h4>
                <span class="fontcolor">小米盒子 增强版</span>
            </div>
            <div class="nav-right">
                <ul>
                    <li><a style="color:rgb(255, 74, 0);" href="">综述</a></li>
                    <li><a class="fontcolor" href="">设计</a></li>
                    <li><a class="fontcolor" href="">片源</a></li>
                    <li><a class="fontcolor" href="">功能</a></li>
                    <li><a class="fontcolor" href="">配置</a></li>
                    <li><a class="fontcolor" href="">产品故事</a></li>
                    <li><a class="fontcolor" href="">参数</a></li>
                    <li><a class="fontcolor" href="">讨论区</a></li>
                    <li><a class="fontcolor" href="">F码通道</a></li>    
                </ul>
                <button type="button" class="button">立即购买</button>
            </div>
       </div>
        <!-- 横向小导航结束 -->
    </div>
    <!-- 图文内容开始 -->
    <div class="sm-box">
        <div class="container">
            <img src="images/reddot.jpg" alt="">
            <div class="sm-box-details">
                <h1>小米小盒子</h1>
                <p>全球最小的全高清网络机顶盒</p>
                <div>
                    <h1>199</h1>
                    <span>元</span>
                </div>
                
                <a href="">立即购买</a>
            </div>
        </div>

    </div>
    <div class="sm-box power">
            <div class="container">
                <div class="sm-box-details">
                    <h1>顶尖科技，小到难以置信</h1>
                    <p>小米小盒子出乎意料的小，采用电源直插，仅占一个插线孔，可</p>
                    <p>随意放在任何一个角落，无需为它特别准备空间。</p>
                </div>
            </div>

    </div>
    <div class="sm-box power design">
            <div class="container">
            </div>

    </div>
    <div class="sm-box power GITV">
        <div class="container">
            <div class="sm-box-details">
                
                <h1 style="margin-top: 210px;">10亿美金打造海量超级影视资源</h1>
                <div>超140000小时</div>
                <p>高清大片、热播电视剧、最新综艺、动漫、体育赛事、经典纪录片</p>
            </div>
        </div>

    </div>
    <div class="sm-box power GITV family">
        <div class="container">
            <div class="sm-box-details">
                
                <!-- <h1 style="margin-top: 135px;">10亿美金打造海量超级影视资源</h1>
                <div>超140000小时</div>
                <p>高清大片、热播电视剧、最新综艺、动漫、体育赛事、经典纪录片</p> -->
            </div>
        </div>
    
    </div>
    <div class="sm-box present">
        <div class="container" style="border-bottom:1px solid rgb(224, 224, 224);">
            <div class="sm-box-details">
                <h1>小米最好的新年礼物</h1>
                <div>
                    <h1>199</h1>
                    <span>元</span>
                </div>
                <div>
                    <img src="images/hz-28.jpg" alt="">
                </div>
                <a href="">立即购买</a>
            </div>
            <div class="box-more">
                <ul>
                    <li>
                        <img src="images/hzs-10.jpg">
                        <p>设计</p>
                    </li>
                    <li>
                        <img src="images/hzs-11.jpg">
                        <p>片源</p>
                    </li>
                    <li>
                        <img src="images/hzs-12.jpg">
                        <p>功能</p>   
                    </li>
                    <li>
                        <img src="images/hz-13.jpg">
                        <p>配置</p>
                    </li>
                    <li>
                        <img src="images/gongyi.png">
                        <p>产品故事</p>
                    </li>
                </ul>

            </div>
        </div>

    </div>
    <div class="sm-box present other-pro">
            <div class="container">
                <ul>
                    <li>
                        <img src="images/shoubing.jpg">
                        <h4>小米蓝牙手柄</h4>
                        <p>双马达振动 三轴重力感应</p>
                        <p>小米电视、盒子游戏必备</p>
                        <span>99元</span>
                    </li>
                    <li>
                        <img src="images/common-footer-mitv2.jpg">
                        <h4>小米电视 2</h4>
                        <p>配位独立音响的超强4K电视</p>
                        <p>含电视、Soundbar与无线低音炮</p>
                        <span>3999元</span>
                    </li>
                    <li>
                        <img src="images/common-footer-mibox.jpg">
                        <h4>小米盒子 增强版</h4>
                        <p>首款4K超高清网络机顶盒</p> 
                        <p>性能提升至3倍，电视变身游戏机</p> 
                        <span>299元</span>
                    </li>
                </ul>
            </div>

        </div>
    <!-- 图文内容结束 -->
    <!-- 尾部开始 -->
    <div class="footer">
        <div class="profit">
            <ul>
                <li>
                    <img src="images/10.png" alt="">
                    <h5>1小时快修服务</h5>
                </li>
                <li>
                    <img src="images/11.png" alt="">
                    <h5>7天无理由退货</h5>
                </li>
                <li>
                    <img src="images/12.png" alt="">
                    <h5>15天免费换货</h5>
                </li>
                <li>
                    <img src="images/13.png" alt="">
                    <h5>man150元包邮</h5>
                </li>
                <li>
                    <img src="images/14.png" alt="">
                    <h5>520余家售后网点</h5>
                </li>
            </ul>
        </div>
        <div class="more">
            <ul>
                <li>
                    <h5>帮助中心</h5>
                    <ul>
                        <li><a href="">购物指南</a></li>
                        <li><a href="">支付方式</a></li>
                        <li><a href="">配送方式</a></li>
                    </ul>
                    
                </li>
                <li>
                    <h5>服务支持</h5>
                    <ul>
                        <li><a href="">售后政策</a></li>
                        <li><a href="">自动服务</a></li>
                        <li><a href="">相关下载</a></li>
                    </ul>
                    
                </li>
                <li>
                    <h5>小米之家</h5>
                    <ul>
                        <li><a href="">小米之家</a></li>
                        <li><a href="">服务网点</a></li>
                        <li><a href="">预约亲临到点服务</a></li>
                    </ul>
                    
                </li>
                <li>
                    <h5>关于小米</h5>
                    <ul>
                        <li><a href="">了解小米</a></li>
                        <li><a href="">加入小米</a></li>
                        <li><a href="">联系我们</a></li>
                    </ul>
                    
                </li>
                <li>
                    <h5>关注我们</h5>
                    <ul>
                        <li><a href="">新浪微博</a></li>
                        <li><a href="">小米部落</a></li>
                        <li><a href="">官方微信</a></li>
                    </ul>
                    
                </li>
                <li>
                    <h4>400-100-5678</h4>
                    <p>周一至周日 8:00-21:00</p>
                    <p>（仅收市话费）</p>
                    <button>24小时在线客服</button>
                </li>
            </ul>
        </div>
        <div class="copyright">
            <div class="container">
                <ul>
                    <li>小米旗下网站：小米网</li>
                    <li>MIUI</li>
                    <li>米聊</li>
                    <li>多看书城</li>
                    <li>小米路由器</li>
                    <li>繁體香港</li>
                    <li>繁體台灣</li>
                    <li>English</li>
                    <li>小米后院</li>
                    <li>小米天猫店</li>
                    <li>小米淘宝直营店</li>
                    <li>小米网盟</li>
                </ul>
                <p>mi.com 京ICP证110507号 京ICP备10046444号 京公网安备1101080212535号 京网文[2014]0009号</p>
                <div>
                    <img src="../MI-HY/images/cnnicVerifyseal.png" alt="">
                    <img src="images/szfwVerifyseal.gif" alt="">
                    <img src="images/save.jpg" alt="">
                    <select name="" id="">
                        <option value="">简体中文</option>
                        <option value="">English</option>
                    </select>
                </div>
            </div>
        </div>
    </div>
    <!-- 尾部结束 -->
</body>
</html>